<template>
    <div id="withdraw">
        <p class="page-title">提现设置</p>
        <div class="container padder">
            <el-form label-position="top" :model="upload" ref="form" label-width="80px" class=" b-b">
                <el-form-item label="设置提现账号" :rules="[{required:true,message:'请上传收款码'}]" prop="Img">
                    <div class="m-b-lg">
                        <el-radio v-model="upload.ID" :label="1">支付宝</el-radio>
                        <el-radio v-model="upload.ID" :label="2">微信</el-radio>
                    </div>

                    <el-upload
                            class="avatar-uploader"
                            action="/api/User/Upload_Chart"
                            :show-file-list="false"
                            :http-request="up"
                            :before-upload="beforeAvatarUpload">
                        <img v-if="upload.Img" :src="upload.Img" class="avatar">
                        <i v-if="!upload.Img && !uploadLoading" class="el-icon-plus avatar-uploader-icon"></i>
                        <i v-if="uploadLoading" class="el-icon-loading avatar-uploader-icon"></i>
                        <div class="el-upload__tip" slot="tip">只能上传jpg/png文件</div>
                    </el-upload>
                </el-form-item>

            </el-form>
            <div class="text-center m-t">
                <el-button type="primary" @click="sure" :loading="loading">确定</el-button>
            </div>

        </div>
    </div>
</template>

<script>
    import mixins from '../../mixin'
    export default {
        name: 'withdraw',
        components: {},
        mixins:[mixins],
        data() {
            return {
                loading: false,
                uploadLoading: false,
                upload: {
                    Img: '',
                    ID: 1
                }
            }
        },
        computed: {},
        methods: {
            up(config) {
                this.uploadLoading = true;
                let fd = new FormData();
                fd.append('image', config.file);
                this.$axios.post(config.action, fd)
                    .then(res => {
                        this.uploadLoading = false;
                        if (res.code == 200) {
                            this.upload.Img = res.msg
                        }
                    })
            },
            sure() {
                this.$refs['form'].validate(valid => {
                    if (valid) {
                        this.$confirm('请确认提现方式和收款码是否匹配,不匹配将会影响提现，是否继续?', '提示', {
                            confirmButtonText: '确定',
                            cancelButtonText: '取消',
                            type: 'warning'
                        }).then(() => {
                            this.loading = true;
                            this.$axios.post(`/api/User/Modification_of_receipts`, this.upload)
                                .then(res => {
                                    this.loading = false;
                                    if (res.code == 200) {
                                        this.$message.success('设置成功')
                                    }
                                })
                        })
                    }
                })
            }
        },
        mounted() {
            this.$axios.get(`/api/user/xianshi_zhifu_data`)
                .then(res => {
                    if (res.code == 200) {
                        this.upload = {
                            ID: res.data.tixian_data.shoukuan_fangshi,
                            Img: res.data.tixian_data.shoukuan_tu,
                        }
                    }
                })
        },
    }
</script>

